<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>元素内容</title>
</head>
<body>

 <div id="box1">

 </div>
</body>

<script>

    /**
     *   innerHTML 和 innerText的区别
     *     innerHTML 可以按照html的规则 解释渲染成 html
     *     innerText 即使内部是html，也只能按照文本形式输出
     * */
    var box1=  document.getElementById('box1');

    box1.innerText = 'hello';
    //box1.innerHTML='hello again!';
    box1.innerHTML += ' hello again!';

    box1.innerText = '<h1>大标题</h1>';
    box1.innerHTML = '<h1>大标题</h1>';


    var message = box1.innerHTML;
    console.log(message);

    var message2 = box1.innerText;
    console.log(message2);

</script>
</html>